<template>
  <div id="KnowledgeIssoe">
    <GoBack :content="'解决方案'" @click="goBackPage"></GoBack>
    <div class="bodyContent">
      <el-scrollbar style="width: 100%; height: 100%">
        <div class="vforItems">
          <!-- <NoData v-if="knowledgeList.length === 0" :msg="'暂无数据'"></NoData> -->
          <div class="issueObjectHeader">{{ issueObject.title }}</div>
          <span class="issueObjectBody">&ensp;&ensp;&ensp;&ensp;{{ issueObject.solution }}</span>
        </div>
      </el-scrollbar>
    </div>
  </div>
</template>

<script setup lang="ts">
// 引入组件区 =========
import { ref, reactive, getCurrentInstance, onMounted } from 'vue';
import Breadcrumb from '@/components/Breadcrumb.vue';
import { VxeMessage, VxeNotifyType } from '@/utils/CommonMessage'; //提示信息
import NoData from '@/components/NoData.vue';
import GoBack from '@/components/GoBack.vue'; //返回组件


// 变量定义区 ==========
let { proxy }: any = getCurrentInstance();
let issueObject = reactive({
  id: '',
  title: '',
  solution: ''
});
let issueId = ref('');
// ============ 方法定义区
onMounted(() => {
  issueId.value = proxy.$route.query.param1;
  getKnowledgeIssueObject();
});

// 查询知识库列表
function getKnowledgeIssueObject() {
  // Object.assign
  const url = '/api/wk/wkKnowledgeIssue/getIssueObject/' + issueId.value;
  proxy.$http
    .get(url)
    .then((res: any) => {
      if (res.status.code === 1) {
        Object.assign(issueObject, res.data);
      } else {
        VxeMessage(res.status.msg, VxeNotifyType.error);
      }
    })
    .catch((err: any) => {
      VxeMessage('获取内容失败', VxeNotifyType.error);
    });
}
//点击返回到上一个页面
function goBackPage(){
  proxy.$router.push({ name: 'knowledgeview', query: { id: proxy.$route.query.param1 } });
}

</script>

<style lang="scss" scoped>
#KnowledgeIssoe {
  width: 100%;
  height: 100%;
  .bodyContent {
    height: calc(100% - 60px);
    width: calc(100% - 20px);
    :deep(.el-scrollbar__view) {
      height: 100%;
      .vforItems {
        padding: 10px;
        width: calc(100% - 20px);
        height: calc(100% - 20px);
        background-color: $base-white;
        .issueObjectHeader {
          text-align: center;
          font-size: 20px;
          font-weight: 700;
          margin-bottom: 10px;
        }
      }
    }
  }
}
</style>
